<template>
    <div id="adminTwo">
      <div class="outer-frame">
        <div class="outer-frame-l">
          <two-l />
        </div>
        <div class="outer-frame-c">
          <two-c />
        </div>
        <div class="outer-frame-r">
          <two-r />
        </div>
      </div>
    </div>
  </template>
  
  <script>
  import TwoL from './two-l.vue'
  import TwoC from './two-c.vue'
  import TwoR from './two-r.vue'
  export default {
    name: 'adminTwo',
    data() {
      return {
      };
    },
    components: { TwoL , TwoC , TwoR },
    mounted() { },
    methods: { },
  };
  </script>
  
  <style lang="scss" scoped>
  #adminTwo{
    background-color: rgba($color: #000000, $alpha: 0)!important;
    height: 100%;
    .outer-frame{
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      height: 100%;
      .outer-frame-l{
        // width: 22%;
        width: 24%;
        height: 100%;
      }
      .outer-frame-r{
        width: 22%;
        height: 100%;
      }
      .outer-frame-c{
        // width: 77%;
        width: 53.4%;
        height: 100%;
      }
    }
  }
  </style>